@base: #79B263;
body {
  font-family:georgia; 
  background: #333;
  text-align:center;
}

.page {
	margin: 0 auto;
	max-width: 400px;
	background-color: white;
	border: 1px solid @base;
	height: 700px;
}

.top-container {
	height: 500px;	
}

.themed-control() {
	background-color: lighten(@base, 30%);
	
}

.heading {
	.themed-control();
	border-bottom: 1px solid @base;
	padding: 5px;
	margin: 10px;
	font-size: 24px;
}

.form {
	margin: 20px;
	margin-bottom: 40px;
}

.button {
	.themed-control();
	padding: 5px;
	margin: 5px;
}

.back-button {
	.themed-control();
	padding: 5px;
	border-left: 1px solid @base;
	margin: 30px auto;
	width: 200px;
}

.menu {
	 padding: 50px;
}

.tile {
	.themed-control();
	float: left;
	width: 120px;
	margin: 5px;
	vertical-align: bottom;
	padding-left: 7px;
	padding-right: 7px;
	padding-bottom: 2px;
	text-align: right;

	.title {
			color: @base;
	}

	.info {
		height: 100px;
		border-bottom: 1px solid @base;
		&.big {
			height: 82px;
			margin-top: 18px;
			.infoitem {
				text-align: center;
				font-size: 50px;
				color: lighten(@base, 10%);
			}
		}
		&.medium {
			height: 90px;
			margin-top: 10px;
			.infoitem {
				text-align: left;
				font-size: 14px;
				color: @base;
				&:before {
					content:" - ";
				}
			}
		}
		&.small {
			height: 90px;
			margin-top: 10px;
			.infoitem {
				text-align: left;
				font-size: 12px;
				color: @base;
				&:before {
					content:" - ";
				}
			}
		}
	}

}

input {
	width: 300px;
	font-size: 14px;
}

.logo {
}